﻿/*

This file is part of the mojomo modular front end design framework for mojoPortal CMS; 
find more at mojomo.co.uk or mojomo.codeplex.com	

Name:       forms.css

Author:     freshangle.co.uk

Version:    1.0

Purpose:    This css file is intended to hold your site specific form styles.
    

*/	 



/*----------------  defaults --------------*/


    /* forms */
        fieldset
        {border:0;margin:0;padding:0}

        legend
        {display:block;width:100%;border:0;color:#333;border-bottom:1px solid #eee;padding:0}

        label
        {display:block;margin-bottom:5px;color:#333}

    /* inputs */
        input
        {line-height:normal;vertical-align:middle;display:inline-block;color:#555;border:1px solid #ccc;
        background-color:#fff;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;
        -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
        box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-webkit-transition:border linear .2s box-shadow linear .2s;
        -moz-transition:border linear .2s box-shadow linear .2s;
        -ms-transition:border linear .2s box-shadow linear .2s;-o-transition:border linear .2s box-shadow linear .2s;
        transition:border linear .2s box-shadow linear .2s;padding:4px}

        input[type="image"]
        {-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;width:auto;height:auto;
        line-height:inherit;border:0;cursor:pointer;-webkit-border-radius:0;-moz-border-radius:0;
        border-radius:0;margin:0 5px 2px 3px;padding:0}

        input[type="hidden"]
        {display:none}

        input[type="button"],input[type="reset"],input[type="submit"]
        {width:auto;height:auto}

        input[type="checkbox"],input[type="radio"]
        {width:auto;height:auto;line-height:inherit;border:0;
        cursor:pointer;-webkit-border-radius:0;-moz-border-radius:0;
        border-radius:0;margin:0 5px 2px 3px;padding:0}
        
        input[type="file"]
        {border:initial;background-color:initial;-webkit-box-shadow:none;-moz-box-shadow:none;
         box-shadow:none;height:28px;margin-top: 0.25em;line-height:inherit;padding:2px initial initial}


    /* selects */
        select
        {display:inline-block;color:#555;border:1px solid #ccc;background-color:#fff;
        border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;height:28px;
        line-height:inherit;  margin-top: 0.25em; padding: 0.1em;}

        select[multiple],select[size]
        {overflow:auto;height:10em;width:12.5em}

    /* textarea */
        textarea
        {display:inline-block;color:#555;border:1px solid #ccc;background-color:#fff;
        border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;
        -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
        box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-webkit-transition:border linear .2s box-shadow linear .2s;
        -moz-transition:border linear .2s box-shadow linear .2s;-ms-transition:border linear .2s box-shadow linear .2s;
        -o-transition:border linear .2s box-shadow linear .2s;transition:border linear .2s box-shadow linear .2s;
        height:auto;padding:4px}

    /* focus styles */
        input:focus,textarea:focus
        {-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(82,168,236,0.6);
         -moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(82,168,236,0.6);
         box-shadow:inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(82,168,236,0.6);
         outline:thin dotted \9;border-color:rgba(82,168,236,0.8)}

        input[type="file"]:focus,input[type="checkbox"]:focus,select:focus
        {-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;outline:5px auto 0;outline-offset:-2px}



/* mojo textboxes */
        /*
         .smalltextbox { width: 4em; }
        .normaltextbox { width: 10em; }
        .mediumtextbox { width: 15em; }
        .widetextbox { width: 25em; }
        .verywidetextbox { width: 35em; }
         */


/*give all textboxes a width...*/	

        .normaltextbox, 
        .widetextbox, 
        input[type="text"], 
        input[type="password"] { width:97%; max-width: 18.5em; }

        .ie6 .normaltextbox, 
        .ie6 .widetextbox , 
        .ie6 .verywidetextbox  { width: 18.5em }
        

        select { width:102.5%; max-width: 19.1em }        
        .ie7 select, 
        .ie6 select { width:102.5%; width: 19.1em }














